import { Button } from 'antd';
import type { SelectProps } from 'antd';
import type { ColumnsType } from 'antd/es/table';
import { getOptionLabel } from '../../data/statusData'

const columns = (booleanOptions: SelectProps['options'], verificationCodeUsages: SelectProps['options'], onRowNumberClick: (record: any) => void) => {
  const columns: ColumnsType<any> = [
    {
      title: '#',
      dataIndex: 'id',
      key: '__row_number',
      align: 'right',
      width: 48,
      render: (text, record, index) => {
        return (
          <Button
            type="link"
            style={{ padding: 0 }}
            onClick={() => onRowNumberClick(record)}
          >
            <em>{index + 1}</em>
          </Button>
        );
      }
    },
    {
      title: '手机',
      dataIndex: 'mobile',
      key: 'mobile'
    },
    {
      title: '验证码',
      dataIndex: 'code',
      key: 'code'
    },
    {
      title: '用途',
      dataIndex: 'usage',
      key: 'usage',
      render: (text, record, index) => {
        return getOptionLabel(verificationCodeUsages, text);
      }
    },
    {
      title: '发送成功',
      dataIndex: 'success',
      key: 'success',
      align: 'center',
      render: (text, record, index) => {
        return getOptionLabel(booleanOptions, typeof(text) === 'boolean' ? text.toString() : '');
      }
    },
    {
      title: '已使用',
      dataIndex: 'used',
      key: 'used',
      align: 'center',
      render: (text, record, index) => {
        return getOptionLabel(booleanOptions, typeof(text) === 'boolean' ? text.toString() : '');
      }
    },
    {
      title: '创建时间',
      dataIndex: 'createdAt',
      key: 'createdAt'
    }
  ];
  return columns;
};

export default columns;
